<template>
  <div class="cloud_pay_money_sign">
    <c-title :hide="false" :text="`云汇算电签`"></c-title>
    <div class="list">
      <div class="line">
        <div class="left">{{ info.date }}</div>
        <div class="right">{{ info.status_name }}</div>
      </div>
      <div class="line_left">
        <div class="left">姓名/手机号</div>
        <div class="right">{{ info.realname }}/{{ info.mobile }}</div>
      </div>
      <div class="line_left">
        <div class="left">身份证</div>
        <div class="right">{{ info.idcard }}</div>
      </div>
      <div class="txt" v-if="info.fail_msg">失败原因：{{ info.fail_msg }}</div>
      <div class="btnBox" v-if="info.status == '-1'">
        <div class="isbtn" @click="toSignCloud">重新签约</div>
      </div>
    </div>
    <div class="btnSign" @click="toSignCloud" v-if="info.status == 0">去签约</div>
    <jianzhimaoPopup @closePopup="closePopupCloud_pay" :payType="pay_type" :show="jianzhimao_bank_show" :bank_card_status="bank_card_status" :set_verify="set_verify"></jianzhimaoPopup>
  </div>
</template>
<script>
import jianzhimaoPopup from "../member/balance/componet/jianzhimaoPopup.vue";
export default {
  data() {
    return {
      info: {},
      jianzhimao_bank_show: false,
      pay_type: "cloud_pay_money_sign",
      set_verify: {},
      bank_card_status: false
    };
  },
  components: { jianzhimaoPopup },
  activated() {
    if (this.$route.query.record_id) {
      this.confirmSign();
    }else{
      this.getData();
    }
  },
  methods: {
    confirmSign() {
      $http.get("plugin.cloud-pay-money.frontend.controllers.sign.signing.sign-result", {}, "").then(res => {
        if (res.result == 1) {
          this.getData();
        } else {
          this.$dialog.alert({ message: res.msg });
        }
      });
    },
    closePopupCloud_pay() {
      this.jianzhimao_bank_show = false;
      this.getData();
    },
    getData() {
      $http.get("plugin.cloud-pay-money.frontend.controllers.sign.signing", {}, "").then(res => {
        if (res.result == 1) {
          console.log(res);
          this.info = res.data;
        } else {
          this.$dialog.alert({ message: res.msg });
        }
      });
    },
    practitioner() {
      $http.get("plugin.cloud-pay-money.frontend.controllers.practitioner.practitioner", {}, "").then(res => {
        if (res.result == 1) {
          console.log(res);
          if (res.data.bank_card_status && res.data.member_info) {
            // 已经填过银行卡跟会员资料的直接请求签约路径
            this.signing();
            return;
          }
          this.bank_card_status = res.data.bank_card_status;
          this.set_verify = res.data.member_set_verify;
          this.jianzhimao_bank_show = true;
        } else {
          this.$dialog.alert({ message: res.msg });
        }
      });
    },
    signing() {
      $http.get("plugin.cloud-pay-money.frontend.controllers.sign.signing.signing", {}, ".").then(res => {
        if (res.result == 1) {
          window.location.href = res.data.sign_url;
        } else {
          this.$dialog.alert({ message: res.msg });
        }
      });
    },
    toSignCloud() {
      if (this.info.status == 0 || this.info.status == '-1') {
        // 没有签约跳转去第三方页面
        this.practitioner();
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.btnSign {
  padding: 0.625rem 0;
  margin: 0 1.5rem;
  box-sizing: border-box;
  background: #fff;
  border-radius: 0.325rem;
  margin-top: 1.5rem;
  text-align: center;
}
.list {
  background: #fff;
  margin: 0 1.5rem;
  display: flex;
  flex-direction: column;
  padding: 0.625rem 0;
  margin-top: 1rem;
  border-radius: 0.325rem;
  .line {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0.625rem;
    .left {
      flex: 1;
      text-align: left;
    }
    .right {
      flex-shrink: 0;
    }
  }
  .txt {
    padding: 0 0.625rem;
    text-align: left;
    margin: 0.3rem 0;
    color: #999;
  }
  .btnBox {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 0 0.625rem;
    .isbtn {
      background: red;
      color: #fff;
      box-sizing: border-box;
      width: 5rem;
      padding: 0.325rem 0.625rem;
      border-radius: 0.625rem;
    }
  }
  .line_left {
    flex: 1;
    padding: 0 0.625rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 0.625rem;
    .left {
      color: #999;
    }
    .right {
      margin-left: 0.5rem;
    }
  }
}
</style>
